/* 
    Document   : default
    Created on : 07-Apr-2010, 14:30:13
    Author     : Dhana

*/


/** General Setup **/

* {
	margin: 0;
	padding: 0;
	text-decoration: none;
}

body {
    font: 80%/1.5 Arial, Tahoma, sans-serif;
}
textarea { font-family: Arial, Tahoma, sans-serif; }
p { font-size: 1.0em; font-weight: normal; margin: 0 0 10px 0; }
h1 { font-size: 2.0em; font-weight: bold; margin: 0 0 20px 0; color: #005581; }
h2 { font-size: 1.5em; font-weight: bold; margin: 0 0 10px 0; color: #225411; }
h3 { font-size: 1.3em; font-weight: bold; margin: 0 0 10px 0; color: #005581; }
h4 { font-size: 1em; font-weight: bold; margin: 0 0 5px 0; color: #225411; }
h5 { font-size: 1em; font-weight: bold; margin: 0 0 10px 0; color: #005581; }
ol, ul { margin-left: 30px; }

a, button, input { outline: none; }
a { text-decoration: none; color: #53ab53; }
a:hover { text-decoration: underline;  }
a:active { text-decoration: none; }
a:visted { text-decoration: none; }

.clearme, .clear { clear: both; height: 1px; }
.clearRight { clear: right; height: 1px; }
.clearLeft { clear: left; height: 1px; }
.displayNone { display: none; }
.displayInline { display: inline; }
.separator { clear: both; height: 1px; margin-bottom: 10px; }
.linkedImage { border: none; }


/* Generic Template Styles */
body { margin: 0 auto 0 auto; padding-top: 15px; background: #002D56 url(/images/bg-gradient.png) repeat-x top left; color: #225411; }
#wrapper { width: 920px; margin: 0 auto 15px auto; padding: 0 30px 0 30px; background-color: #fff; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; behavior: url(/compat/PIE.php); position: relative;}
#header { position: relative; width: 100%; height: 112px; margin-top: 10px; padding: 25px 0 0 0; z-index: 999; }
#logo { background: url(/images/cabot-logo.png) no-repeat; float: left; display: block; width: 155px; height: 62px; text-indent: -5000px; }
#loginStatus { width: 160px; float: right; text-align: right; }
#loginStatus p { color: #939598; font-size: 1.1em; font-weight: bold; }
#loginStatus p a { color: #939598; text-decoration: none; }
#loginStatus p a:hover { text-decoration: underline; }
.strapline { width: auto; float: right; text-align: right; margin: 9px 0 17px 0; clear: none; }
.strapline.first { clear: right; }
.strapline p { color: #005581; font-size: 1.8em; line-height: 40px; }
.strapline img { margin: -5px 10px 0 10px; }

/* Generic menu styling */

#menuBar { clear: both; margin: 0 0 20px 0; height: 46px; position: relative; background: url(/images/menu-bg.png) no-repeat top left; }
#menuBar, #menuBar ul { padding: 0; margin: 0; list-style: none; line-height: 45px; }
#menuBar a { display: block; color: #fff; font-size: 1.3em; font-weight: bold; }
#menuBar li { float: left; width: 152px; text-align: center; }
#menuBar li ul { position: absolute; width: 234px; left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */ }
#menuBar li ul li { line-height: 20px; }
#menuBar li ul li a { width: 200px; }
#menuBar li ul ul { margin: -2em 0 0 13em; }
#menuBar li:hover ul ul, #menuBar li:hover ul ul ul, #menuBar li.sfhover ul ul, #menuBar li.sfhover ul ul ul { left: -999em; }
#menuBar li:hover ul, #menuBar li li:hover ul, #menuBar li li li:hover ul, #menuBar li.sfhover ul, #menuBar li li.sfhover ul, #menuBar li li li.sfhover ul { /* lists nested under hovered list items */ left: auto; }

#menuBar ul li.first { width: 153px; }
#menuBar ul li.first a:hover { border-left: none; background: url(/images/nav-home-on.png) no-repeat top left; }
#menuBar ul li.last a { width: 156px; color: #005581; }
#menuBar ul li.last a:hover { border-right: none; background: url(/images/nav-end-on.png) no-repeat top left; }
#menuBar ul li:hover { background: url(/images/nav-butt-on.png) repeat-x top left; }
#menuBar ul li a:hover { text-decoration: none; color: #fff; }
#menuBar ul li.on { background: url(/images/nav-butt-on.png) repeat-x top left;  }
#menuBar ul li.first.on { background: url(/images/nav-home-on.png) no-repeat top left; }
#menuBar ul li.last.on a { background: url(/images/nav-end-on.png) no-repeat top left; color: #fff; }

/* Sort out conflict with first/last being added to submenus */
#menuBar ul li ul { background: #fff url(/images/drop-down-menu-curves.png) no-repeat top left; line-height: 25px; padding-top: 10px;  }
#menuBar ul li ul li { margin: 5px 0 0 10px; background: none; line-height: 16px; }
#menuBar ul li ul li a { border: none; background: #fff url(/images/nav-blue-arrow.png) no-repeat left top; color: #225411; font-size: 0.9em; font-weight: normal; text-align: left; padding: 0px 0px 0px 10px; }
#menuBar ul li ul li a:hover { border: none; background: #fff url(/images/nav-orange-arrow.png) no-repeat left top; color: #F99D32; text-decoration: none; }
#menuBar ul li ul li.first a { color: #005581; }
#menuBar ul li ul li.first.on { background: #fff url(/images/nav-orange-arrow.png) no-repeat left top; color: #F99D32; }
#menuBar ul li ul li.last { margin-bottom: 7px; background: #fff url(/images/nav-blue-arrow.png) no-repeat left top; color: #005581; }
#menuBar ul li ul li.last.on a { background: none; color: #F99D32; }
#menuBar ul li ul li.first a:hover { border: none; background: #fff url(/images/nav-orange-arrow.png) no-repeat left top; color: #F99D32; }
#menuBar ul li ul li.last a:hover { border: none; background: #fff url(/images/nav-orange-arrow.png) no-repeat left top; color: #F99D32; }
#menuBar ul li ul li.on a { color: #f99D32; border: none; background: #fff url(/images/nav-orange-arrow.png) no-repeat left top;}
#menuBar ul li li.padder { position: absolute; bottom: -5px; left: -10px; width: 234px; background: url(/images/drop-down-footer.png) no-repeat bottom left; }

/* Third level items */
#menuBar ul li ul li ul { background: transparent url(/images/drop-down-menu-curves-flat.png) no-repeat top left; line-height: 25px; padding-top: 10px; }
#menuBar ul li ul li.on ul li a { border: none; background: #fff url(/images/nav-blue-arrow.png) no-repeat left top; color: #005581; font-size: 0.9em; font-weight: normal; text-align: left; padding: 0px 0px 0px 10px; }
#menuBar ul li ul li ul li a:hover { border: none; background: #fff url(/images/nav-orange-arrow.png) no-repeat left top; color: #F99D32; text-decoration: none; }
#menuBar ul li ul li ul li.first a { color: #005581; }
#menuBar ul li ul li ul li.last { margin-bottom: 7px; background: #fff url(/images/nav-blue-arrow.png) no-repeat left top; color: #005581; }
#menuBar ul li ul li ul li.last.on a { background: none; color: #005581; }
#menuBar ul li ul li ul li.first a:hover { border: none; background: #fff url(/images/nav-orange-arrow.png) no-repeat left top; color: #F99D32; }
#menuBar ul li ul li ul li.last a:hover { border: none; background: #fff url(/images/nav-orange-arrow.png) no-repeat left top; color: #F99D32; }
#menuBar ul li ul li.on ul li.on a { color: #f99D32; border: none; background: #fff url(/images/nav-orange-arrow.png) no-repeat left top;}

/* Home page layout */

#rotatingImages { clear: both; width: 920px; height: 260px; margin: 0 auto; padding: 0; overflow: hidden; }
#homeContentContainer { clear: both; width: 920px; margin: 20px auto 0 auto; position: relative; }
#homeTabContainer { float: left; width: 470px; height: 308px; overflow: visible; background: url(/images/home-tab-bg.png) repeat-x top left; padding: 20px 50px 20px 20px; -webkit-border-radius: 5px 5px 5px 5px; -moz-border-radius: 5px 5px 5px 5px; border-radius: 5px 5px 5px 5px; behavior: url(/compat/PIE.php); position: relative; }
#homeContentContainer .homeTab {  display: none; }
#homeContentContainer .homeTab.tab0 { display: inline; }
#homeContentContainer .homeTab h1 { color: #006600; font-size: 2.2em; margin: 0 0 10px 0; }
#homeContentContainer .homeTab p { color: #006600; font-size: 1.1em; line-height: 18px; margin-left: 3px; }
#homeContentContainer .homeTab .tabLinkButton { display: block; text-decoration: none; background: url(/images/blue-arrow-butt.png) no-repeat top left; width: 155px; height: 27px; color: #fff; padding: 8px 0px 0px 15px; position: absolute; bottom: 20px; left: 20px; }
#homeTabSelectors {
	overflow: visible;
	float: left;
	margin-left: 20px;
	width: 360px;
	height: 348px;
	background: url(/images/home-tab-selector-bg.png) repeat-x top left;
-webkit-border-radius: 5px 5px 5px 5px; -moz-border-radius: 5px 5px 5px 5px; 	border-radius: 5px 5px 5px 5px;
	behavior: url(/compat/PIE.php);
	position: relative;
	z-index: 999;
	background-color: #FFFFFF;
}

/* Home tab selectors styling */

#homeTabSelectors ul {
	list-style: none;
	position: absolute;
	top: 17px;
	left: -65px;
	background-color: #FFFFFF;
	width: 1px;
	height: 325px;
}
#homeTabSelectors li { font-size: 1.5em; margin-left: -65px; padding-left: 65px; line-height: 82px; }
#homeTabSelectors li a {
	display: block;
	width: 375px;
	height: 95px;
	color: #225411;
	left: -100px;
	top: 18px;
	padding: 0px;
	margin: 0px;
}
#homeTabSelectors ul li:first-child a {
	background-color: transparent;
	color: #CCCCCC;
	margin-left: 0px;
}
#homeTabSelectors li a:hover { color: #00ff00; text-decoration: none; }

/* Main inner template */

#contentArea { position: relative; width: 100%; padding-top: 20px; clear: both; margin: 10px 0 25px 0; }
#mainContent {
	position: relative;
	float: left;
	width: 530px;
	overflow: hidden;
	background-color: #FFFFFF;
	visibility: visible;
}
#rightColumn { position: relative; width: 360px; float: left; overflow: hidden; margin: 0 0 25px 30px; }
#footer { position: relative; clear: both; width: 920px; border-top: 1px dotted #000; margin: 25px auto 0px auto; }

/* Main Content Area Styles */
#contentArea p { margin-bottom: 15px; }
#contentArea p.breadcrumb a { color: #005581; }
#contentArea p.breadcrumb a:last-child { color: #f99D31; }
#contentArea p.breadcrumb { padding-bottom: 10px; }

/* Right hand column styles */
#rightColumn #callMeBack a { display: block; width: 340px; height: 50px; background: url(/images/live-chat-butt-big.png) no-repeat top left; margin: 0 0 25px 0; padding: 15px 0 0 20px; font-size: 1.8em; color: #6d6e71; line-height: 70px; }
#rightColumn #callMeBack a:hover { color: #005581; text-decoration: none; }

#rightColumn #videoPod { position: relative; margin: 0 0 25px 0; padding: 0; width: 360px; height: 65px; background: url(/images/video-butt-right-arrow.png) no-repeat top left; }
#rightColumn #videoPod.on { background: url(/images/video-butt-down-arrow.png) no-repeat top left; }
#rightColumn #videoPod img { border: none; }
#rightColumn #videoPod a { display: block; width: 360px; height: 65px; font-size: 1.8em; color: #6d6e71; line-height: 70px; text-indent: -5000px;  }
#rightColumn #videoPod a:hover { color: #005581; text-decoration: none; }
#rightColumn #videoContainer { width: 280px; height: 158px; margin: 0 auto; display: none; }


#rightColumn .orangePod { width: 320px; background: #F99D32 url(/images/orange-pod-bg.png) repeat-x top left; margin: 25px 0 25px 0; padding: 20px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; behavior: url(/compat/PIE.php); position: relative; }
#rightColumn .yellowPod { width: 320px; background: #FFE14F url(/images/yellow-pod-bg.png) repeat-x top left; margin: 25px 0 25px 0; padding: 20px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; behavior: url(/compat/PIE.php); position: relative; }

#rightColumn .orangePod h2, #rightColumn .yellowPod h2 { font-size: 1.8em; }
#rightColumn .yellowPod h2, #rightColumn .yellowPod p, #rightColumn .yellowPod li, #rightColumn .yellowPod a { color: #005581; }
#rightColumn .orangePod h2, #rightColumn .orangePod p, #rightColumn .orangePod li, #rightColumn .orangePod a { color: #fff; }

#rightColumn .orangePod ul, #rightColumn .yellowPod ul { margin: 0 0 0 0; list-style: none; }
#rightColumn .orangePod li { background: transparent url(/images/orange-bullet.png) no-repeat left top; margin: 0 0 15px 0; padding: 2px 0 0 30px; min-height: 21px; line-height: 18px; }
#rightColumn .yellowPod li { background: transparent url(/images/blue-bullet.png) no-repeat left top; margin: 0 0 15px 0; padding: 2px 0 0 30px; min-height: 21px; line-height: 18px; }

/* Footer Styles */

#footer #footerLogos { width: 500px; height: 65px; float: left; margin: 23px 0 0 0; }
#footerLogos img { float: left; border: none; margin: 0 17px 0 0; }

#footer #footerInfo { width: 420px; float: left; }

#footer p#copyright { text-align: right; font-size: 0.7em; margin: 15px 0 0 0; padding-bottom: 15px; }
#footer ul#links { text-align: right; list-style: none; font-size: 0.7em; margin: 0 0 0 0; }
#footer ul#links li { display: inline; border-left: 1px solid #58595b; }
#footer ul#links li.first { border-left: none; }
#footer ul#links li a { color: #58595b; text-decoration: none; margin: 0 3px 0 6px; }
#footer ul#links li a:hover { text-decoration: underline; }

/* Friendly form */
.friendlyForm { margin-bottom: 10px; position: relative; }
.friendlyForm fieldset { margin: 0 0 1em 0; padding: 1em; border: none; }
.friendlyForm legend { font-weight: bold; color: #333; margin-bottom: 10px; }
.friendlyForm ul, .friendlyForm ol, .friendlyForm dl { margin: 0; padding: 0; }
.friendlyForm li { width: 99%; margin: 0; padding: 0 0 5px 0; list-style: none; clear: left; }
.friendlyForm li div { position: relative; width: 250px; float: left; }
.friendlyForm label { width: 180px; margin-right: 20px; margin-bottom: 3px; }
.friendlyForm input { width: 270px; height: 20px; line-height: 20px; border: 1px solid #bbb; -webkit-border-radius: 5px; -moz-border-radius: 5px; }
.friendlyForm input.shortInputField { width: 80px; }
.friendlyForm select { width: 270px; height: 20px; border: 1px solid #bbb; background: transparent; -webkit-border-radius: 5px; -moz-border-radius: 5px;  }
.friendlyForm select.shortSelectField { width: auto; }
.friendlyForm textarea { width: 270px; height: 100px; border: 1px solid #bbb; -webkit-border-radius: 5px; -moz-border-radius: 5px; }
.friendlyForm .checkbox { width: auto; margin-top: -3px; margin-right: 5px; border: none; }
.friendlyForm .radio { width: auto; margin-top: -3px; margin-right: 5px; border: none; }
.friendlyForm .helper { font-size: 0.75em; color: #666; padding: 5px 0 5px 0; margin: 0 0 0 250px; display: none; clear: both; }
.friendlyForm label.focus { font-weight: bold; color: #0E3083; border: none;}
.friendlyForm label.hidden { visibility: hidden; }
.friendlyForm label.disabled { color: #aaa; }
.friendlyForm .inputField.focus { border: 1px solid #0E3083; }
.friendlyForm .inputField.required { background-color: #eee; }
.friendlyForm .errorMsg { color: #EB3E33; font-weight: bold; }
.friendlyForm .showHide { clear: both; margin: 0; font-size: 0.8em; text-decoration: none; }
.friendlyForm .multiCol li { width: 220px; clear: none; float: left; padding: 0; margin: 0 20px 0 0; }
.friendlyForm .multiCol label { width: 180px; font-size: 0.9em; }

.friendlyForm .button, .button { width: auto; font-size: 1.0em; height: auto; padding: 2px 4px 2px 4px; float: left; margin-right: 5px; }

.friendlyForm p { clear: both; }
p > label:first-child { float: left; width: 160px; border: none; display: block; }


.formError { width: 98%; padding: 4px; margin: 4px 0 4px 0; clear: both; background-color: #DFDFDF; border: 1px solid #941212; }
.formError h3 { color: #941212; font-weight: bold; font-size: 0.9em; margin: 0; }

.formSuccess { width: 98%; padding: 4px; margin: 4px 0 4px 0; clear: both; background-color: #d2ebcd; border: 1px solid #106b1b; }
.formSuccess h3 { color: #106b1b; font-weight: bold; font-size: 0.9em; margin: 0; }

.friendlyForm label.error { clear: both; float: left; font-size: 0.9em; color: #ff0000; width: auto; margin: 0 10px 10px 180px; }

div.error { width: 98%; padding: 4px; margin: 10px 0 10px 0; clear: both; background-color: #DFDFDF; border: 1px solid #941212; display: none; }
div.error h3 { color: #941212; font-weight: bold; font-size: 0.9em; margin: 0; }
input.error, select.error, textarea.error { background-color: #DFDFDF; }

/* Login Form */

.friendlyForm.loginForm { border: none; background: transparent; }
.friendlyForm.loginForm fieldset { border: none; padding: none; margin: 0 0 0 0; }
.friendlyForm.loginForm label { font-size: 0.95em; font-weight: bold; }
.friendlyForm.loginForm input { font-size: 1.0em; color: #727272; height: 20px; }
.friendlyForm.loginForm input#loginButton { width: auto; font-size: 1.0em; height: auto; }

/* Accordion */
.accordion { margin-bottom: 10px; }

/*Faq search form */
.faqSearchForm { width: 480px; margin: 0; padding: 5px 10px 15px 10px; }
.faqSearchForm h2 { float: left; width: 125px; }
.faqSearchForm input { float: left; width: 350px; font-size: 1.1em; margin: 2px 0 0 0; }

/* News */

#yearSelector { list-style: none; }
#yearSelector li { float: left; margin-bottom: 15px; }

.articleList { list-style: none; }
.articleList li { background-color: #fafafa; border: 1px solid #adadad; padding: 5px; margin-bottom: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; behavior: url(/compat/PIE.php); position: relative; }
.articleList h4 a { color: #005581; }
.articleList h4 a:hover { color: #f99d31; }
.articleList p.moreLink { text-align: right; font-size: 0.8em; position: absolute; bottom: -5px; right: 10px; }
.articleList p.moreLink a { color: #005581; }
.articleList p.moreLink a:hover { color: #f99d31; }

/* Glossary */
#glossaryContainer { width: 865px; margin: 0 auto; clear: both; }
#glossaryContainer h2 { margin-bottom: 0px; }
#glossaryContainer .definitionContainer { background-color: #edf0f5; padding: 5px; }
#letterSelection { width: 880px; margin: 0 auto; }


.newsImage { float: right; margin-left: 20px; }
.newsLink { clear: both; margin: 10px 0 20px 0; }
.newsLink a { color: #005581; }
.newsLink a:hover { color: #f99d31; }

/* Testimonials */
blockquote.quotation { background: transparent url(/images/quotation-mark.png) no-repeat top left; padding: 35px 0 0 35px; border-bottom: 1px dashed #adadad; }
blockquote.quotation p.cite { font-style: italic; font-weight: bold; font-size: 0.9em; color: #005581; }
#rightColumn ul li blockquote p.cite { font-weight: bold; font-style: normal; text-align: right; font-size: 0.8em; margin-top: -10px; }
#rightColumn blockquote { font-style: italic; margin-bottom: 15px; }
#rightColumn blockquote p.cite { font-weight: bold; font-style: normal; text-align: right; font-size: 1.0em; margin-top: 0px; }
	
/* Sitemap */
ul#sitemap { margin-left: 2em; margin-bottom: 1em; }
ul#sitemap li { list-style: disc; }
ul#sitemap li ul { margin-left: 20px; }

/* Budget Calculator */
#budgetCalculatorTable td { padding: 3px; }
#budgetCalculatorTable .darkRow { background-color: #D2E5F3; font-weight: bold; }
#budgetCalculatorTable .lightRow { background-color: #E6EFF7; font-weight: bold; }


/* Left/right align */
.leftAlign { float: left; margin: 0 1em 1em 0; }
.rightAlign { float: right; margin: 0 0 1em 1em; }

.ui-corner-all { border-radius: 5px; behavior: url(/compat/PIE.php); position: relative; }


.sliderHeader { margin: 0 0 -1px 0; font-weight: normal; color: #00537F; }
.sliderHeader a { display: block; width: 460px; padding: 3px 40px 5px 5px; border-top: 1px solid #fff; border-bottom: 1px solid #fff; text-decoration: none; background: #005581 url(/images/white-arrow-blue-bg.png) no-repeat 98% 50%; color: #fff; font-size: 0.8em; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
.sliderContainer { clear: both; display: none; width: 485px; padding: 20px 10px 10px 10px; margin: 1px 0 0 0; background-color: #EAEAEA; }
.sliderContainer.on { display: block; }
.sliderHeader a.on { background: #005581 url(/images/white-arrow-blue-bg-down.png) no-repeat 98% 50%; }
.sliderContainer a { color: #00537f; }
.faqHeader { margin-top: 20px; }

/* Video Player */

a#player {
	display:block;
	width: 430px;
	height:322px;
	text-align:center;
	margin:0 15px 15px 0;
	float:left;
	border:1px solid #999;
}

a.widescreen {
    display:block;
	width: 640px;
	height:360px;
	text-align:center;
	margin:0 15px 15px 0;
	float:left;
	border:1px solid #999;
}

/* play button */
a#player img {
	margin-top:40px;
	border:0px;
}

/* when container is hovered we alter the border color */
a#player:hover {
	border:1px solid #000;
}